<template>
	<view class="cell-item content">
		<view class="left">
			<image class="left-icon" :src="icon" mode="aspectFit"></image>
		</view>
		<view class="context">{{text}}</view>
		<view class="right">
			<image class="right-icon" :src="ArrowIcon" mode="aspectFit"></image>
		</view>
	</view>
</template>

<script setup>
	import DeaultIcon from '../../static/icons/settings_password.png';
	import ArrowIcon from '../../static/icons/settings_arrow.png';

	defineProps({
		icon: {
			type: String,
			default: DeaultIcon
		},
		text: {
			type: String,
			default: "修改密码"
		}
	})
</script>

<style scoped>
	.content {
		height: 100rpx;
		padding: 32rpx;
		display: flex;
		align-items: center;
		background-color: #fff;
	}

	.left {
		margin-right: 32rpx;
		
	}

	.left-icon {
		width: 40rpx;
		height: 40rpx;
	}

	.context {
		flex: 1;
		font-size: 16px;
		color: #333333;
	}

	.right-icon {
		width: 40rpx;
		height: 40rpx;
	}
</style>